<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>FrameWorks: PrimeFaces</title>
        <link href="#{request.contextPath}/img/icoprime.png" rel="shortcut icon" />    
        <h:outputStylesheet name="../css/styles.css"/>
        <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>
        <script type="text/javascript">  
            var currentMarker = null;  

            function handlePointClick(event) {  
                if(currentMarker == null) {  
                    document.getElementById('lat').value = event.latLng.lat();  
                    document.getElementById('lng').value = event.latLng.lng();  

                    currentMarker = new google.maps.Marker({  
                        position:new google.maps.LatLng(event.latLng.lat(), event.latLng.lng())  
                    });  

                    map.addOverlay(currentMarker);  

                    dlg.show();  
                }
                dlg.show(); 
            }  

            function markerAddComplete() {  
                var title = document.getElementById('title');  
                currentMarker.setTitle(title.value);  
                title.value = "";  

                currentMarker = null;  
                dlg.hide();  
            }  

            function cancel() {  
                dlg.hide();  
                currentMarker.setMap(null);  
                currentMarker = null;  

                return false;  
            }  
            
        </script>  
        <script type="text/javascript">  
                function handleRegisterResponse(xhr, status, args) {  
                    if(args.validationFailed || !args.success) {  
                        jQuery('#dialog').effect("shake", { times:3 }, 100);  
                    } else {
                        setTimeout(function() {
                            window.location.href = "faces/index.xhtml";
                            }, 3000);

                        //window.location="faces/index.xhtml";
                    }  
                }                
            </script> 
    </h:head>
    <h:body>

        <!-- CABECERA: Logotipos y título de la web -->
        <div id="head">
            <div class="contenedor960" style="margin-top: 10px; height: 80px">
                <img width="69" height="69" style="float: left; margin-top: 10px" alt="Primefaces Logo" src="img/pf-logo.png"/>
                <img width="69" height="69" style="float: left;margin-left: 20px; margin-top: 10px" alt="Prime Logo" src="img/prime-transparente.png"/>
                <div style="width: 400px;float: right">
                    <h1 class="title" style="margin-left: 10px; font-size: 20px; color: gainsboro">MÁSTER INFTEL</h1>
                    <h2 class="title" style="font-size: 15px; color: gainsboro">- FrameWorks: PrimeFaces -</h2>
                </div>
            </div>
        </div> <!-- fin cabecera -->       


        <div class="contenedor960" style="min-height:1000px">
        <p:growl id="growl" showDetail="true" life="3000" />  
            <h:form>  
                <p:panel id="dialog" header="Sign Up" >

                    <br/>    
                    <h:outputLabel id="notice" value="Complete the fields. Fields with asterisk are required." />  <br/>
                    <br/>

                    
                    <p:messages id="messages" showDetail="true" autoUpdate="true"/>
                    <h:panelGrid columns="2">   
                        <h:outputLabel for="name" value="Name: *" />  
                        <p:inputText id="name" label="name" required="true" value="#{signUpBean.name}">                              
                        </p:inputText>

                        <h:outputLabel for="lastname" value="Lastname: *"/>                                                    
                        <p:inputText id="lastname" label="lastname" required="true" value="#{signUpBean.lastname}">
                        </p:inputText>  

                        <h:outputLabel for="email" value="Email: *" />  
                        <p:inputText id="email" label="email" required="true" value="#{signUpBean.email}" >  
                        </p:inputText>                                  

                        <h:outputLabel value="Birthday: *" />  
                        <p:calendar value="#{signUpBean.birthday}" label="birthday" required="true" id="birthday" navigator="true" effect="drop" maxdate="#{signUpBean.now}" yearRange="c-100:c"/>  
                        
                        <h:outputText value="Sex: " /> 
                        <p:selectOneMenu value="#{signUpBean.sex}" label="sex">  
                            <f:selectItem itemLabel="Male" itemValue="M" />  
                            <f:selectItem itemLabel="Female" itemValue="F" />  
                        </p:selectOneMenu>

                        <h:outputLabel for="city" value="City: " />  
                        <p:inputText id="city" label="city" required="true" value="#{signUpBean.city}">                             
                        </p:inputText>

                        <h:outputLabel for="password1" value="Password: *" />  
                        <p:password id="password1" value="#{signUpBean.password}" 
                                    feedback="true"
                                    match="password2" 
                                    label="Password1" 
                                    required="true"/>  

                        <h:outputLabel for="password2" value="Repeat the Password: *" />  
                        <p:password id="password2" value="#{signUpBean.password}" 
                                    feedback="false"
                                    label="Password2" 
                                    required="true"/>  
                       
                        <h:outputLabel id="photo" value="Add a photo: " /> 
                        <p:fileUpload fileUploadListener="#{signUpBean.handleFileUpload}"  
                                      mode="advanced"   
                                      update="messages"  
                                      sizeLimit="100000"   
                                      allowTypes="/(\.|\/)(gif|jpe?g|png)$/"/>  
                        </h:panelGrid>
                        
                    <p:captcha label="captcha" />

                    <p:commandButton value="Finish" 
                                     action="#{signUpBean.register}" 
                                     oncomplete="handleRegisterResponse(xhr, status, args)" 
                                     update="growl" />  
                    
                </p:panel>
            </h:form>
            
            

            <!--<p:gmap id="gmap" center="36.890257,30.707417" zoom="13" type="HYBRID"   
                                                    style="width:300px;height:300px"  
                                                    model="#{mapBean.emptyModel}"   
                                                    onPointClick="handlePointClick(event)"></p:gmap>   
            
                                            <p:dialog widgetVar="dlg" effect="FADE" effectDuration="0.5" close="false" fixedCenter="true">  
                                                <h:form prependId="false">  
                                                    <h:panelGrid columns="2">  
                                                        <h:outputLabel for="title" value="Title:" />  
                                                        <p:inputText id="title" value="#{mapBean.title}" />  
            
                                                        <f:facet name="footer">  
                                                            <p:commandButton value="Add"   
                                                                             actionListener="#{mapBean.addMarker}"   
                                                                             update="messages"   
                                                                             oncomplete="markerAddComplete()"/>  
                                                            <p:commandButton value="Cancel" onclick="return cancel()"/>  
                                                        </f:facet>  
                                                    </h:panelGrid>  
            
                                                    <h:inputHidden id="lat" value="#{mapBean.lat}" />  
                                                    <h:inputHidden id="lng" value="#{mapBean.lng}" />  
            
                                                </h:form>
                                            </p:dialog> -->

          





        </div> <!-- fin contenedor960 -->

        <!-- PIE -->
        <div id="pie">
            <div class="contenedor960">
                <div id="pie_col_Izquierda" style="float:left">
                    <h3>Información de Contacto</h3>
                    <p> Para más información sobre las distintas prácticas realizadas por este grupo
                        de trabajo, envíenos un email a <a href="mailto:masterinftel@google.es?Subject=WEB%20MASTERINFTEL">masterinftel@google.es</a>
                        y en breve nos pondremos en contacto con usted.
                    </p>         
                </div> <!-- fin pie_col_Izquierda -->

                <div id="pie_col_Centro" style="float:left">
                    <h3>Developed By: </h3>
                    <ul>
                        <li>Miguel Angel Quero</li>
                        <li>Alejandro Leva</li>
                        <li>Miguel Pintor</li>
                    </ul>
                </div> <!-- fin pie_col_Centro -->
                <div id="pie_col_Derecha" style="float:left">
                    <h3>Páginas de interés: </h3>
                    <p>
                        <a href="http://www.primefaces.org">
                            <img src="http://forum.primefaces.org/styles/ca_gen2_blue/imageset/site_logo.gif" alt="PrimeFaces" style="width: 90; height: 30px"/>
                        </a>
                    </p>
                    <p>
                        <a href="http://www.oracle.com/technetwork/java/javaee/javaserverfaces-139869.html">
                            <img src="http://3quarks.net/images/java_transparent.png"
                                 alt="Java Server Faces" style="width: 35; height: 35px"/>
                        </a>
                    </p>
                </div> <!-- fin pie_col_Derecha -->
            </div> <!-- fin contenedor960 -->
        </div> <!-- fin pie -->

        <!-- PIE: Copyright -->
        <div id="copyright">
            <div class="contenedor960">
                <p>&copy; Copyright 2011 MASTER INFTEL. Todos los derechos reservados</p>
            </div> <!-- fin contenedor960 -->
        </div> <!-- fin copyright -->

    </h:body>
</html>

